Hace poco en los comentarios tuvimos una larga charla sobre la forma de modificar el tamaño de imágenes mediante un código.
En varias entradas ya muestro la forma de hacerlo pero viendo que es de interés y contestando a la pregunta de ahí va una muestra.
Cuando añadimos una imagen a nuestro blog lo podemos hacer subiendo la imagen con el editor de Blogger o bien añadiendo la url de la imagen.
El tamaño de la imagen dependerá del tamaño que escogemos: Pequeño-Mediano-Grande.
Pequeño (200)
Mediano (320)
Grande (400)Simultáneamente a esas medidas Blogger en el mismo código muestra el tamaño máximo para visualizar una imagen y es 1.600. Es el tamaño que vemos cuando clicamos sobre la imagen independientemente de el tamaño que escogimos para mostrar.
¿Cómo hacer que una imagen sea más pequeña por ejemplo para añadirla en la sidebar?
La forma de hacerlo es la siguiente:
<img src="aquí-la-url-de-la-imagen" border="0" height="60" width="80" />
Los valores height y width los podemos variar según el tamaño que deseamos para nuestras imágenes. Aumentaremos en border si deseamos que nuestra imagen muestre un borde.
Si deseas ver más sobre "Enlazar imágenes, modificar tamaño,información adicional y abrir en ventana aparte" Mira aquí.
Admiro como explicas los detalles pequeños, que al fin y al cabo son los mas grandes en dificultad.
Si me lo permites quisiera añadir algo.
Hay ocasiones en las que, cuando añadimos los valores heigth (alto) y width (ancho) la imagen puede salir desproporcionada (a mi al principio me pasaba). Para evitarlo tan solo añadiremos uno de los valores, o el alto o el ancho, y así conseguiremos que, al modificar el tamaño de la imagen, las medidas sean proporcionales entre si porque el otro valor se aplica automáticamente.
Un ejemplo:
Si una imagen mide 400 de ancho x 300 de alto, si la queremos reducir a la mitad pondríamos 200 y 150 como valores de ancho y de alto respectivamente pero, ¿y si la imagen mide 418 x 179? Al ser cifras llamémosles "no exactas" no sabríamos si los valores que diéramos de alto y ancho deformarían la imagen.
No se si me he explicado bien. Espero que si y os sirva de ayuda.
Un saludo,
JmpaSrgc
Excelente, tienes toda la razon... Te explicastes perfectamente. Gracias.
JmpaSrgc desconocía que variando solamente un atributo automáticamente el otro valor sea aplicado, es más... en las pruebas que hice para el ejemplo la imagen se distorsiona (siempre me ha pasado) normalmente hago el mismo cálculo que en tu ejemplo, calculo la mitad, la cuarta parte... y así sucesivamente hasta dar con la medida deseada.
Es probable que ocurra como comentas, y si la medida es impar nos quede desproporcionada , la solución además de la que nos has dado sería redondear hasta que la cifra fuera par. 418x179 a 219x90
Gracias de nuevo ;)
Hola, antes que nada quiero agradecerte por la dedicación que has puesto en este blog. Tengo una duda que no tiene que ver con lo el post pero necesito que alguien me ayude.
El blog que tengo tiene 3 colulmnas, cuando lo habro con mozilla salen estas 3 columnas, pero cuando lo abro con explorer sale solo la sidebar de la derecha y el titulo de una entrada. Que puede ser?
Espero que puedas responder a mi duda... De todas maneras te agradezco por todo.
graxias por visitarme ... tu blog es excelte,...
saludos
jocarl
guatemala
Todo perfectamente explicado y te agradezco todas tus explicaciones que para mí son como "el blog de cabecera".
Con respecto a esta entrada que explicas con todo detalle, sólo te puedo decir que todo ello es cierto SALVO LAS LIMITACIONES DE formato de LAS PLANTILLAS de Blogger.
Si quiero presenta en mi blog una foto más grande, entro en Photoshop le doy una anchura de 400 pixeles, la subo y automaticamente Blogger me la encaja en su tamaño preestablecido de platilla.
Me imagino que para ello tienes alguna solución de formato de plantilla, please.
Gracias, una vez más.
No debería verse así Sheccid pero no es extraño que visionemos el blog distinto con diferentes navegadores.
Si antes no presentaba este error no hay duda que ha sido por algún cambio realizado en tu plantilla.
Haz memoria sobre lo último que modificaste antes de descubrir el error y la única solución es suprimiendo lo añadido.
A veces una simple imagen demasiado grande puede llegar a desplazar la columna pero no es tu caso.
Las medidas de las sidebar y el main están muy bien no superan las de outer-wrapper.
Yo haría lo siguiente:
Ve a plantilla y suprime el código de la #newsidebar que añadiste, luego SIN guardar cambios mira en vista previa (todo eso accediendo con Explorer) si en vista previa todas tus entradas puedes verlas no hay duda que es la sidebar que añadiste.
Gracias a ti Jocarl ;)
PUNTIYO no hace falta que modifiques la imagen con Photoshop Bloggger te acepta cualquier tamaño otra cosa es el que te muestra, nunca superará 400 escogiendo el tamaño grande.
Todo depende también del espacio que tengas para las entradas, por ejemplo si tienes de main 600 y la imagen está alojada en Blogger con 400 con el editor de Blogger y manualmente puedes adaptarla a 600.
La forma de hacerlo es subiendo la imagen como normalmente hacemos. Luego nos situamos en Redactar.
Clicamos sobre la imagen y nos muestra unos márgenes, si arrastramos con el ratón esos márgenes vamos extendiendo la imagen hasta darle el tamaño deseado.
Hice una captura para que lo veas:
Captura
Naturalmente volvemos a lo mismo si hacemos que la imagen sea de mayor tamaño al main pueden pasar dos cosas, que la imagen se superponga sobre la sidebar, o que no se visione en la entrada.
No sé si lo habrás visto pero hay una forma de poder visionar las imágenes a su tamaño natural sin salir de la página (cosa obligada cuando clicamos sobre una imagen alojada en Blogger)
Puedes verlo aquí se trata de un script.(tengo que corregir ese efecto de esconderse en la sidebar)
Espero haber contestado a tu pregunta no estoy muy segura ;)
Hola Gema :)
He vuelto a escribir de nuevo un blog y estoy modificando el diseño de la plantilla. Mi pregunta es la siguiente:
Me gustaría insertar un calendario en la sidebar número 1 (donde tengo puestos mis links) pero todos los que encuentro son demasiado complicados e incluso a veces, antiestéticos. He visto algunos que me han encantado, como por ejemplo aquí http://cfradier.free.fr/bloog/ pero no consigo crear uno para mí partiendo de lo que he visto.
Si pudieras explicar algún día cómo hacer un calendario de ese tipo, te estaría muy agradecido (y seguro que mucha más gente)
Un abrazo enorme ^_^
PD: Por cierto, quité gracias a tí esos puntitos tan feos que salían alrededor al clikar en los links, jejeje. Gracias por adelantado.
Perfectamente contestada.
Muchas gracias
Saludos Le petit aún no he agregado ninguno con el nuevo Blogger pero si lo deseas mira este tópico donde lo explican:daleclick.jconserv
!Suerte¡
Ok PUNTIYO ;)
Gemma...hola. he regresado de una semana infernal en la universidad y je venido a verte...quería hacerte una preguntita, hay alguna forma de colocar los archivos de los blogs antiguos de una forma mas resumida, es que me esta tomando mucho espacio y había pensado en algo como un scroll o algo
besitos
eres un sol
Tengo un problema con esta mejora, al aumentar el tamaño de las imágenes por encima de 400, pierdo calidad, parece que blogger las guarda solo a 400 y todo lo que sea aumentar por encima de eso es a costa de perder calidad. ¿Llevo razón? ¿Hay alguna forma de evitarlo?
Siento no haber contestado a tu pregunta Elizabetha la he visto de casualidad ahora :(
Por cierto ¿cómo estás?
LordVader estás en lo cierto, yo suelo utilizar un visor de imágenes.
Es una forma de ampliar la imagen que oscurece el fondo del blog dando prioridad a la imagen.
Puedes ver los efectos para que te hagas una idea.
Thumbnail
Lytebox
Peronalmente prefiero Lytebox ya que con él es posible crear Slideshow.
quiero saber si se puede cambiar automaticamente el tamaño de la imagen de fondo de acuerdo a la resolucion del monitor en donde se vea la pagina web
Salvador automáticamente no, debes hacerlo manualmente si la imagen es una textura no hay problema de que se repita, pero si es una imagen tipo fotografía debes añadir el atributo no-repeat.
Puedes seguir estos pasos ;)
HOLA TODOS
me encantaria saber como puedo hacer para que las imagenes uqe posteo en mi blog sean mas grandes que lo que la opcion de tamanio "grande" me permite.
cualquier info sera muy bienvenida
gracias!
Saludos OnTheCorner pensaba que te había contestado a este comentario anteriormente pero por causas que desconozco no lo encuentro :(
He visitado tu blog y el espacio que tienes es width: 510px; es decir, puedes añadir imágenes que no excedan de ese tamaño. Como sabes en Blogger para mostrar imágenes el máximo es 400px; lo que puedes hacer añadir un código de manera que agregues la medida adecuada según la imagen.
Por ejemplo pata añadir la primera imagen de tu último post añades:
<img src="aquí-la-url-de-la-imagen" border="0" height="700" width="510" />
La url de la imagen la puedes conseguir fácilmente subiendo la imagen a Blogger, puedes copiar la segunda url donde proporciona la imagen (s400) la de s1600 no, nos lleva a ninguna parte y pegarla en el código donde dice "aquí-la-url-de-la-imagen"
Mira este ejemplo.
Otra opción sería mostrar las imágenes en una ventana modal estéticamente queda muy vistoso y en mi opinión muy profesional. Puedes ver sobre ventanas modales en iBox- Lytebox- Visor de imágenes Todo es según el gusto de cada uno ;)
Estimada, muchisimas gracias por el dato de como ampliar las fotografías, soy nueno en todo esto.
Pero me ha surgido un problema, cada vez que agrando la fotografía perde calidad, se pixela, y la gotografía original es de muy buena calidad.
Hay algun tipo de solución?
Desde ya gracias.
Saludos.
Bienvenido Fantasmas peleándole al viento.
Para agrandar una fotografía y que esta se muestre con toda la calidad que tiene lo mejor (en mi opinión es mostrarla en una ventana modal)
La ventana modal puede añadirse con varias librerías js. el efecto es una imagen de un tamaño que no ocupe demasiado y al hacer click sobre ella se muestra en su tamaño original oscureciendo toda la pantalla, de este modo la fotografía toma especial protagonismo ver ejemplo
Hay otras librerías que simplemente con el click acercan la imagen hasta el tamaño real ver ejemplo
Todo es probar porque las opciones son muchas.
Una de las más sencillas es añadir un script en la plantilla, puedes ver su efecto aquí y otro aquí
Cualquier cosa me dices algo, parece complicado pero es sencillo crear esos efectos ;)
Sorry no salió el antepenúltimo enlace era este ;)
Gracias por el dato!!! me fue muy util! n_n ya me estaba quebrando la cabeza para saber que hacer y te dejo mi blog por si quieres verlo es un blgo sencillo sobre mis opiniones de las fregaderas de la vida
Texto
Ammm si aun toy muy wey para esto de los blogs hahahahaahah es
El Blog de Gio n_n saluditos
Gracias Gio eres muy amable :)
Gema sabrias si hay alguna manera para que blogger o picasa no comprimieran las imagenes que mandamos al blog? no me refiero a cambiar el tamaño sino a que cuando pinchas en la miniatura te salga la imagen que tu has subido tal cual y no comprimida por ellos, pues se nota la merma en la calidad de la imagen.
Saludos.
Hola @ngel, si Blogger no comprimiera la imagen las mostraría en su tamaño real y lo que hace es mostrar tres tamaños diferentes algo que a simple vista es un contratiempo pero yo pienso que nos beneficia en el sentido que si disponemos de unas medidas determinada para el espacio de los post las imágenes que añadimos habría que reducirlas o aumentarlas de tamaño antes de subirlas.
¿Por qué? porque si subimos imágenes de mayor tamaño al espacio que disponemos nos veriams con problemas como por ejemplo de desplazarse la sidebar que es lo que ocurre muchas veces cuando añadimos algún vídeo o cualquier otra cosa que supera la medida.
Conclusión.... que de todas formas tu puedes subir las imágenes como más te guste con los tres tamaños de Blogger y en tamaño real ¿quieres saber cómo?
Vas a tener que verlo aquí porque está mucho más claro.
Que disfrutes de tus imágenes :)
Gema ya leí ese artículo antes de preguntarte. Creo que no me he expresado bien, me refiero a que aunque la entrada la comprima de tamaño, luego al clikar en ella se supone que la ves al tamaño real y es ahí donde tb se ve algo mal.
No me refiero a la compresión de tamaños sino a la compresión de calidad, a la compresión JPG que seguro la hacen muy fuerte para que el tamaño del archivo les pese menos y eso hace que se creen en la imagen unos halos o artefactos que se llaman por comprimir el JPG mucho.
Yo subo imagenes a 800 pix el lado más grande y pesan alrededor de 250Kb que no es nada, si encima las recomprimen más pues se nota en la calidad sobre todo en fotos con mucho contraste de tonos.
Parece ser me han dicho que en Flickr no pasa eso, la miniatura si la comprimen pero al clikar te muestra la foto tal cual la mandaste.
No se si ahora me explique mejor.
Un saludo.
Pues entonces me pillas fuera de juego en este tema @ngel, no sé como trabaja Flickr para comprobarlo nada mejor que crear una cuenta allí, yo suelo subir imágenes a Sky Drive son de cámara digital y de gran tamaño y no veo que pierdan nitidez o calidad.
Si quieres probamos, me mandas una imagen de las que piensas está "dañada" al subirla a Blogger y la alojo en mi cuenta de Sky Drive que veas el resultado.
Una cosa que si me di cuenta es que añades marcos a las fotos ¿no perderá calidad en ese proceso?
Ok Gema te mando la imagen, a ver si encuentro tu correo.
Lo de los marcos no tiene nada que ver, es más, me he dado cuenta ya del todo en las últimas entradas del blog que son sin marcos, sobre todo en las que se titulan Otoño.
Saludos.
Aún no la he recibido @ngel :(
Ya te las he enviado.
Gracias! Me sirvió bastante :D
Saludos gema!
Gracias a ti por comentar Sabrina :)
Hola!Muy interesante tu blog, es una rica fuente de información. Me gustaría saber si existe una forma de evitar que se puedan agrandar las imágenes de mi blog al hacerles clik. No sé si se trata el tema en otro post. He hechado un vistazo pero no he visto nada similar. Muchas gracias!!
Te agrego a mi blog!
ES URGENTE!
necesito que todas las imagenes de mis post queden del mismo tamaño..
tengo la plantilla gamezine y necesito eso, que quede automatico, plis ayuda!
Hola. Un afectuoso saludo y una calurosa felicitación por tu blog, está magnífico ¿podrías ayudarme? Necesito poner widgets en la parte izquierda de mi blog. ¿Crees que es posible? Por tu colaboración, muchas gracias. Esta es la dirección de mi blog:
http://cihuaranch.blogspot.com
:: Lamento ver el comentario con tanto retraso Brochazos, si aún no lo has solucionado esta entrada puede serte útil:
http://gemablog-.blogspot.com/2008/11/muchos-lo-preguntan-y-todos-lo-queremos.html
:: Anónimo creo que sería posible si en los estilos e los post añades el tamaño escogido.
:: Saludos José Antonio, para poder añadir gargets a la izquierda antes se tendría que añadir una sidebar, ese poaso puedes verlo en la siguiente entrada, pero por lo que he visto estás utilizando una plantilla de las nuevas y los nombres de los estilos son algo distintos que en esa explicación que aporto ya que todos los ejemplos me baso en la plantilla original de Blogger.
http://gemablog-.blogspot.com/2007/04/aadir-sidebar.html
@Gem@
Muchisimas gracias por responder a mi inquietud, te agradezco.
:: Suerte ;)
Muchas gracias por tu ayuda! Me ha sido muy util la información : )
:: Exprimiendome me alegra que te fuera útil :)
Muchísimas gracias, se hace muy útil sobre todo para las infografías grandes!! Os dejo mi blog por si lo queréis visitar, son reportajes, noticias y análisis de Ciencia y Tecnología: http://www.esavants.blogspot.com
Con retraso pero gracias :)
Nota: solo los miembros de este blog pueden publicar comentarios.